{% extends 'layouts/base.html' %}
{% block content %}
<style type="text/css">
label.error {
    color: red;
    float: none;
}
.info_content_wrap .row_cell_four{
   padding: 12px 15px 11px 15px;
    font-size: 16px;
   line-height: 24px;
}
.info_content_wrap .weui_cell .black_color{
   color:black;
   font-weight: bold;
}
.info_content_wrap .weui_cell .refund_btn_box:after{
      content: " ";
      height: 0px;
      width: 0px;
      border-width: 0px;
      display: none;
}
.info_content_wrap .weui_cell .refund_btn_box .refund_btn{
    padding: 5px 11px;
    line-height: 27px;
    font-size: 13px;
    color: black;
    border: 1px solid #888888;
    border-radius: 3px;
    cursor: pointer;
}

</style>
<form action="{{url('index/Mobileregister/reseting')}}" method="post">
  <div id="container" class="bj_color info_content_wrap">
        <div class="weui_cells weui_cells_access">
             <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">客户姓名</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.client_name}} </p>
                    <input class="weui_input" name="client_name" value="{{info.client_name}}" as="edit"  type="text" placeholder="请输入姓名"  style="display:none;"/>
                </div>  
            </div>
            <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">手机号码</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.client_phone}}</p>
                    <input class="weui_input" name="client_phone" value="{{info.client_phone}}" as="edit" type="tel" placeholder="请输入号码" style="display:none;"/>
                </div>  
            </div>
            <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">出发地址</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.start_address}}</p>
                    <input class="weui_input" name="start_address" as="edit" type="text" placeholder="请输入地址" value="{{info.start_address}}" style="display:none;"/>
                </div>  
            </div>
            <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">目的地址</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.arrive_address}}</p>
                    <input class="weui_input" type="text" name="arrive_address" value="{{info.arrive_address}}" as="edit"  placeholder="请输入地址"  style="display:none;"/>
                </div>  
            </div>
            <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                   <label class="weui_label">搬运日期</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.carrydate}}</p>
                     <input class="weui_input"  name="carrydate" value="{{info.carrydate}}" as="edit"  type="date" placeholder="请输入地址"  style="display:none;"/>
                </div>  
            </div>
        </div> 

      <div class="weui_cells weui_cells_access">
            <a href="{{url('index/Mobileregister/feeinfo')}}/openid/{{openid}}/order_number/{{info.order_number}}" class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">费用信息</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>查看详情</p>
                </div>
                <div class="weui_cell_ft">
                </div>  
            </a>
            <a href="{{url('index/Mobileregister/modelsinfo')}}/openid/{{openid}}/order_number/{{info.order_number}}" class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">派送车辆</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>查看详情</p>
                </div>
                <div class="weui_cell_ft">
                </div>  
            </a>
             <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">预付定金</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt black_color">
                    <p>{{info.already_price}}</p>
                </div>  
                 {% if info.order_state == 1 %}
                <div class="weui_cell_ft refund_btn_box">
                    <span class="refund_btn" id="refund">退款</span>
                </div>
                 {%elseif info.order_state == 0%}
                <div class="weui_cell_ft refund_btn_box">
                    <span class="refund_btn" id="weixinpay">付款</span>
                </div>
                 {%endif%}
            </div>

            <div class="weui_cell row_cell_two">
                <div class="weui_cell_hd left_txt">
                     <label class="weui_label">优惠金额</label>
                 </div>
                 <div class="weui_cell_bd weui_cell_primary right_txt black_color">
                     <p>{{info.card_fee}}</p>
                 </div>  
            </div>

            <div class="weui_cell row_cell_two">
                <div class="weui_cell_hd left_txt">
                     <label class="weui_label">尾款金额</label>
                 </div>
                 <div class="weui_cell_bd weui_cell_primary right_txt black_color">
                     <p>{{info.final_payment}}</p>
                 </div>  
            </div>
            <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">订单编号</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.order_number}}</p>
                </div>  
            </div>
            <div class="weui_cell row_cell_two">
               <div class="weui_cell_hd left_txt">
                    <label class="weui_label">下单时间</label>
                </div>
                <div class="weui_cell_bd weui_cell_primary right_txt">
                    <p>{{info.createtime}}</p>
                </div>  
            </div>         
      </div>        
      {% if info.already_edit != 1 and info.order_state in [0,1,2] %}
      <div class="btn_box">
           <a href="javascript:;" class="weui_btn submit_btn" id="showAlter">修改</a>
      </div>      
      {%endif%}
      
      
      <!--此为弹窗-->
      <div class="weui_dialog_confirm" id="Alter" style="display: none;">
          <div class="weui_mask"></div>
          <div class="weui_dialog">
              <div class="weui_dialog_hd"><strong class="weui_dialog_title">是否要修改订单信息吗？</strong></div>
              <div class="weui_dialog_bd">一旦修改不可再操作<br>...</div>
              <div class="weui_dialog_ft">
                  <a href="javascript:;" class="weui_btn_dialog default">取消</a>
                  <a href="javascript:;" id="comfirm" class="weui_btn_dialog sure_btn">确定</a>
              </div>
          </div>
      </div>      
  </div>
    <input type="hidden" name="openid" value="{{openid}}">
    <input type="hidden" name="order_number" value="{{info.order_number}}">
</form>    
{% endblock %}
{% block script %}
<script src="{{config['application']['site']['assetsUri']}}front/js/jquery.min.js"></script>
<script src="{{config['application']['site']['assetsUri']}}front/js/jquery.validate.min.js"></script>
<script>
      $(function(){
          
          {% if info.order_state == 1%}
            //退款
            $("#refund").click(function(){
                if(confirm("确认退款") == true){
                    window.location.href= '{{url("index/order/refund")}}/order_number/{{info.order_number}}';
                }
                return ;
            });
            {%elseif info.order_state == 0%}
            $("#weixinpay").click(function(){
                window.location.href= '{{url("order/weixinpay")}}?order_number={{info.order_number}}';
                return ;
            });
            
          {%endif%}
          
             $("#showAlter").click(
                  function(){
                      $('#Alter').show();
                      $('#Alter').find('.weui_btn_dialog').on('click', function () {
                          $('#Alter').hide();
                      });
                  }
              );
      
              //确定
            $('#comfirm').click(function(){
                    $("input[as='edit']").show().siblings('p').hide();
                    $('#showAlter').unbind().text('保存').click(function(){
                        $('form').submit();
                    });
            });
            
            String.prototype.replaceAll = function (str1,str2){
                var str = this; 
                var result = str.replace(eval("/"+str1+"/gi"),str2);
                return result;
            };

            // 手机号码验证
            jQuery.validator.addMethod("isMobile", function (value, element) {
                var length = value.length;
                var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
                return this.optional(element) || (length == 11 && mobile.test(value));
            }, "请正确填写您的手机号码");

            jQuery.validator.methods.compareDate = function(value, element) {
                //var startDate = jQuery(param).val() + ":00";补全yyyy-MM-dd HH:mm:ss格式
                //value = value + ":00";

                var startDate = value;
                var date1 = new Date(Date.parse(startDate.replaceAll("-", "/")));
                var today  = new Date();
                return date1 >= today;
            };

            jQuery.validator.methods.maxDate = function(value, element) {
                var startDate = value;
                var date1 = new Date(Date.parse(startDate.replaceAll("-", "/")));
                    date1 = date1.getTime();
                var today  = new Date();
                    today = today.getTime();
                    today  += (3600000*24*7);
                return date1 <= today;
            };
            $( "form" ).validate({
                    rules: {
                        client_name: {
                                required: true,
                                maxlength:10
                        },
                        client_phone: {
                                required: true,
                                isMobile: true
                        },
                        carrydate:{
                                required: true,
                                compareDate: true,
                                maxDate: true
                        },
                        start_address: {
                                required: true,
                                maxlength: 50
                        },
                        driver_address: {
                                required: true,
                                maxlength: 50,
                        },
                    },
                    messages:{
                        client_name:{
                            required: '请输入您的姓名！',
                            maxlength:'长度不能超过10个字符！'
                        },
                        client_phone:{
                            required: '手机号码不能为空！',
                            isMobile : '请正确填写您的手机号码！'
                        },
                        carrydate:{
                            required: '请输入预约日期！',
                            compareDate: "搬运日期必须大当前日期！",
                            maxDate: '搬运日期不能大于一周后！'
                        },
                        start_address:{
                            required: '请输入起始地！',
                            maxlength: '不能超过50个字符！'
                        },
                        driver_address:{
                            required: '请输入目的地！',
                            maxlength: '不能超过50个字符！'
                        },
                    }
            });
                
});
    
   </script>
{% endblock %}
